<template>
  <div class="coupon">
    <van-nav-bar
        v-if="$store.state.device !== 'APP'"
        title="我的卡包"
        left-text="返回"
        left-arrow
        @click-left="$router.go('-1')"
    />
    <h3 class="title_h3">助学金 <span></span></h3>
    <div class="tab_list">
      <a :href="'/elective-choose?school_id='+wxData.school_id+'&device='+$store.state.device+'&center_id='+wxData.learn_center_id+'&gsign='+$store.state.gsign+'&uniacid='+$store.state.uniacid" v-for="item in stipendList" :key="item.id" class="tab_item">
        <div class="number_text"><span>￥</span>{{item.discount_price}} <span>元</span></div>
        <p>{{item.policy_desc}}</p>
        <p>有效期：{{item.start_time | time}} 至 {{item.end_time | time}}</p>
      </a>
      <div v-if="stipendList.length === 0" class="no_order">
        <van-icon name="cash-on-deliver" />
        <P>暂无助学金</P>
      </div>
    </div>
<!--    <van-cell :title="bt_text" is-link url="/subsidy-list" />-->
    <van-cell title="补贴"/>
    <subsidy-list></subsidy-list>
  </div>
</template>
<script>
import SubsidyList from '@/components/list'
export default {
  name: 'coupon',
  components: {
    SubsidyList
  },
  data () {
    return {
      bt_text: '补贴',
      stipendList: [],
      wxData: {
        school_id: '',
        learn_center_id: ''
      },
      phone: ''
    }
  },
  filters: {
    time: function time (value) {
      let d = new Date(parseInt(value) * 1000)
      return (d.getFullYear()) + '-' + (d.getMonth() + 1 > 9 ? d.getMonth() + 1 : '0' + (d.getMonth() + 1)) + '-' + (d.getDate() > 9 ? d.getDate() : '0' + d.getDate())
    }
  },
  props: {},
  watch: {},
  methods: {
    // 获取公众号所需id
    getWx () {
      this.$http({
        url: `${window.SITE_CONFIG['personalURL']}/api/ajax.product/getWx?gsign=${this.$store.state.gsign}`,
        method: 'get',
        withCredentials: false
      }).then(({ data: res }) => {
        if (res.status !== 200) {
          return false
        }
        this.wxData = res.data
      }).catch(() => {})
    },
    // 获取助学金
    getStipend () {
      this.$http({
        url: `${window.SITE_CONFIG['readSetURL']}/apis/getPhonePolicy.html?phone=${this.$store.state.personal.phone || this.$route.query.phone}`,
        method: 'get',
        withCredentials: false
      }).then(({ data: res }) => {
        // if (res.status !== 1) {
        //   this.$toast(res.meg)
        // }
        this.stipendList = res.data || []
      }).catch(() => {})
    }
  },
  computed: {},
  created () {
  },
  mounted () {
    if (this.$route.query.phone) {
      this.$store.state.personal.phone = this.$route.query.phone
    }
    localStorage.setItem('stateData', JSON.stringify(this.$store.state))
    this.getStipend()
    this.getWx()
  },
  destroyed () {
  }
}
</script>
<style lang="scss" scoped>
  .coupon {
    min-height: 100%;
    .no_order{
      font-size: 30px;
      color: #e6e6e6;
      text-align: center;
      padding: 50px 0;
      i{
        font-size: 160px;
      }
    }
    .van-cell {
      position: relative;
      display: -webkit-box;
      display: -webkit-flex;
      display: flex;
      box-sizing: border-box;
      width: 100%;
      padding: 15px 25px;
      overflow: hidden;
      font-size: 20px;
      font-weight: bold;
      color: #333333;
      line-height: 24px;
      background-color: #fff;
    }
    .van-nav-bar {
      border-bottom: 1px solid #efefef;
    }
    .van-nav-bar .van-icon {
      color: #231916;
      vertical-align: middle;
    }
    .van-nav-bar__text {
      display: inline-block;
      margin: 0 -15px;
      padding: 0 15px;
      color: #231916;
      vertical-align: middle;
    }
    .title_h3{
      padding: 30px 35px;
      font-size: 36px;
      color: #333333;
      margin: 0;
      background-color: #ffffff;
    }
    .tab_list{
      padding: 30px 35px;
      background-color: #ffffff;
      margin-bottom: 30px;
      border-bottom: 30px solid #F6F6F6;
      .tab_item{
        background: url("../../../assets/img/modules/psersonal/coupon_1.png") no-repeat center;
        background-size: 100%;
        width: 680px;
        height: 250px;
        padding: 35px;
        display: block;
        margin-bottom: 30px;
        .number_text{
          font-size: 90px;
          color: #FFFFFF;
          letter-spacing: -2.7px;
          span{
            font-size: 30px;
            &:last-child{
              font-size: 50px;
            }
          }
        }
        p{
          font-size: 28px;
          color: #FFFFFF;
          margin: 10px 0;
          width: 450px;
          overflow: hidden;
          text-overflow:ellipsis;
          white-space: nowrap;
        }
      }
    }
  }
</style>
